import { findTreeDepts,deptsDelete } from "@/api/admin/dept";
import type { PaginationProps } from "@pureadmin/table";
import { message } from "@/utils/message";
import dayjs, { type Dayjs } from "dayjs";
import { ElMessage, ElMessageBox } from 'element-plus';

import {
  ref,
  reactive,
  onMounted
} from "vue";

type deviceModelRow = {
  id: string;
};


export function useColumns() {
  // 定义树数据 listQuery 对象 和列表
  const listQuery = ref({
    deptName: "", // 名称
    page: 1, // 当前页数
    limit: 10 // 一页展示多少
  });
  const listLoading = ref(false);
  const listData = ref([]);
  const rowInfo = reactive<deviceModelRow>({ id: "" });
  const dialogDeleteVisible = ref(false);
  const gatewayProtocolOption = ref([]);
  //表头
  const columns: TableColumnList = [
    {
      label: "部门名称",
      prop: "deptName",
    },
    {
      label: "部门描述",
      align: "left",
      prop: "description",
      formatter: ({ description }) => (description || "-")

    },
    {
      label: "成员数量",
      align: "left",
      prop: "deptNums",
      formatter: ({ deptNums }) => (deptNums || "-")
    },
    {
      label: "创建时间",
      align: "left",
      prop: "createTime",
      formatter: ({ createTime }) =>
        dayjs(createTime).format("YYYY-MM-DD HH:mm:ss")
    },
    {
      label: "操作",
      align: "left",
      fixed: "right",
      width: 120,
      slot: "operation"
    }
  ];
  const pagination = reactive<PaginationProps>({
    total: 0,
    pageSize: listQuery.value.limit,
    currentPage: listQuery.value.page,
    background: true
  });
  function handleFilter() {
    getList();
  }
  function handleSizeChange(val: number) {
    listQuery.value.limit = val;
    pagination.pageSize = val;
    getList();
  }
  function handleCurrentChange(val: number) {
    listQuery.value.page = val;
    pagination.currentPage = val;
    getList();
  }
  function getList() {
    listLoading.value = true;
    findTreeDepts(listQuery.value)
      .then(res => {
        if (res.resp_code == 200) {
          listData.value = res.datas;
          pagination.total = res.datas.length;
          listLoading.value = false;
        } else {
          message(res.resp_msg, { type: "error" });
        }
      })
  }
  async function handleDelete(val: object) {
    try {
      await ElMessageBox.confirm('您确定要删除该部门吗？', '操作提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'error',
        draggable: true,
      });
      const deleteRes = await deptsDelete({ id: val.id });
      if (deleteRes.resp_code === 200) {
        // 确保删除完成后再刷新 
        getList();
        ElMessage.success(deleteRes.resp_msg);
      } else {
        ElMessage.error(deleteRes.resp_msg);
      }
    } catch (error) {
      // 用户取消或其他错误
      if (error !== 'cancel') {
        console.error('删除失败:', error);
      }
    } finally {
    }
  }

  function confirmDelete() {
    // delObj(rowInfo.id).then(res => {
    //   if (res.resp_code == 200) {
    //     dialogDeleteVisible.value = false;
    //     message(res.resp_msg, { type: "success" });
    //     getList();
    //   } else {
    //     message(res.resp_msg, { type: "error" });
    //   }
    // });
  }


  onMounted(async () => {
    getList();
  });
  return {
    listQuery,
    columns,
    pagination,
    getList,
    handleSizeChange,
    handleCurrentChange,
    handleFilter,
    listLoading,
    listData,
    handleDelete,
    dialogDeleteVisible,
    confirmDelete,
    gatewayProtocolOption,
  };
}
